<style type="text/css">

#example1 {
width: 300px;
border: medium #E41D55 double;
}

#example2 { /* Opera only */
width: 200px;
border: medium #E41D55 double;
}

#example3 {
width: 300px;
height: 7em;
border: medium #E41D55 double;
}

#example4 {
border: medium #E41D55 groove;
}

#scroll-track{
 height:10px;
 width:10px;
 background:black;
}

#scroll-handle{
 border: 1px solid black;
 height:10px;
 width:10px;
 background:#5B207B;
 cursor:pointer;
}

</style>
<style>
		/**{margin:0;padding:0}*/
		html,code{font:15px/22px arial,sans-serif}
		html{background:#fff;color:#222}
		html,body{margin:0;padding:0}
		
		.scroll {
			width: 250px;
			height: 300px;
			padding: 10px;
			color: #666;
		}
		
		#toggle
		{
			display: block;
			height: 24px;
			width: 270px;
			text-align: center;
			background-color: #f3f3f3;
			color: #444;
			font-weight: bold;
			cursor: pointer;
		}
		#toggle:hover
		{
			background-color: #ccc;
		}
		
		/*
			jScrollpane demo overrides
		*/
		.jspContainer
		{
			
		}
		.jspPane
		{
		/*    width: 266px !important;*/
		}
		.jspVerticalBar
		{
			width: 14px;
		}
		.jspDrag
		{
			width: 6px;
			margin-left: 4px;
			border-radius: 3px;
			-o-border-radius: 3px
			-moz-border-radius: 3px;
			-webkit-border-radius: 3px;
			background-color: #BB1157;
		}
		.jspTrack
		{
			background-color: #d2d2d2;
		}
		.jspVerticalBar .jspCap
		{
			display: block;
			height: 4px;
			background-color: #d2d2d2;
		}
	</style>
<link type="text/css" href="<?php echo Yii::app()->theme->baseUrl; ?>/css/jquery.jscrollpane.css" rel="stylesheet" media="all" />
<!-- latest jQuery direct from google's CDN --> 
		<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.6/jquery.min.js"></script> 
		<!-- the mousewheel plugin --> 
		<script type="text/javascript" src="<?php echo Yii::app()->theme->baseUrl; ?>/js/jquery.mousewheel.js"></script> 
		<!-- the jScrollPane script --> 
		<script type="text/javascript" src="<?php echo Yii::app()->theme->baseUrl; ?>/js/jquery.jscrollpane.custom.min.js"></script>
<script src="<?php echo Yii::app()->theme->baseUrl; ?>/js/jsScrollbar.js"></script>
<script type="text/javascript">
		$(document).ready(function()
		{
			$('.scroll').jScrollPane(
			{
				showArrows: false,
				animateScroll: true,
				animateDuration: 200,
				mouseWheelSpeed: 200,
				keyboardSpeed: 120,
				/* This next parameter is new to jScrollpane-custom */
				animateSteps: true
			});
			
			var toggleState = true;
			$('#toggle').click(function()
			{
				toggleState = !toggleState;
				$('.scroll').jScrollPane(
				{
					showArrows: false,
					animateScroll: true,
					animateDuration: 200,
					mouseWheelSpeed: 200,
					keyboardSpeed: 120,
					animateSteps: toggleState
				});
				$('.scroll').data('jsp').scrollToY(0,toggleState);
			});
		});
	</script>

<tr><td width="50%" align="left">

<h3>Latest Messages</h3>

<?php 
$con=Message::getList('MESSAGE-LIST', array('type'=>'guest')); ?>
<div class="scroll" style="height:165px;width: 365px;">
<?php foreach($con as $cont) { ?>
<div>
<img src="<?php echo Yii::app()->theme->baseUrl; ?>/images/Flower_heart.jpg" />
</div>
<div style="margin-left: 70px; margin-top: -40px;">
<?php echo $cont->message ; ?> 
</div>
<div>
<?php
$datetime = strtotime($cont->created);
$mysqldate = date("d/m/y g:i A", $datetime);
?>
<br>
<span style="padding-left: 70px;font-size: 1.1em;padding-top: 5px"><?php echo 'from '.$cont->name.' on '.$mysqldate; ?> </span>
</div>
<br/>
<?php 

}  ?>

	</div>
</td>

<td width="50%" align="left">
	<div style="margin-left: -310px;margin-right: -320px;">
<?php if(Yii::app()->user->hasFlash('success')){?>
  <div class="flash-success" style="color:red; width=10px">
     <?php echo Yii::app()->user->getFlash('success');?></div>
<?php }?>
<?php $form=$this->beginWidget('CActiveForm', array(
	'id'=>'guest-book-form',
	'enableAjaxValidation'=>false,
)); ?>

<?php echo CHtml::errorSummary(array($model)); ?> 
<div>
		<label>Enter Name :</label><br><input type="text"  name='item1' id='example1' value="" >
</div>
<div>
		<label>Enter Email ID :</label><br><input type="text"  name='item2' id='example1' value="" >
</div>
<div>
		<label>Enter Your Message :</label><br><textarea name="item3" cols="50" rows="7" id="example3"></textarea>
</div>


<div class="row buttons">
		<?php echo CHtml::submitButton('send'); ?>
	</div>
<?php $this->endWidget(); ?>
</div>

</td></tr>